<template>
	<view>
		<uni-popup ref="popup" type="center" animation borderRadius="10px 10px 0 0">
			<view class="gl-popup-view">
				<view class="gl-popup-title">
					<view class=""> {{title}} </view>
					<uni-icons class="gl-button-mini gl-button-error" type="closeempty" size="18" color="#fff"
						@tap="popupEvent"></uni-icons>
				</view>
				<view class="gl-popup-body" style="display: flex;gap: 10px;">
					<view class="ui-all" style="display: flex;flex-direction: column;gap: 10px;padding: 0 10px;">
						<image :src="sConf.cos + (curSku.icon || '/media/default/cover.png')" mode=""
							@click="changeCover" style="width: 128px;height: 170px;border-radius: 5px;"></image>
					</view>
					<view class="ui-all" style="display: flex;flex-direction: column;gap: 10px;">
						<view class="ui-list" style="display: flex;align-items: center;gap: 10px;">
							<text>产品名称</text>
							<uni-easyinput v-model="curSku.name" type="text" trim="all"></uni-easyinput>
						</view>
						<view class="ui-list" style="display: flex;align-items: center;gap: 10px;">
							<text>产品条码</text>
							<uni-easyinput :disabled="Boolean(curSku.sku)" v-model="curSku.idcode" type="number"
								trim="all"></uni-easyinput>
						</view>
						<view class="ui-list" style="display: flex;align-items: center;gap: 10px;">
							<text>产品货号</text>
							<uni-easyinput :disabled="Boolean(curSku.sku)" v-model="curSku.sdcode" type="text"
								trim="all"></uni-easyinput>
						</view>
						<view class="ui-list" style="display: flex;align-items: center;gap: 10px;">
							<text>商户SKU</text>
							<uni-easyinput v-model="curSku.sku" type="number" trim="all" disabled></uni-easyinput>
						</view>
					</view>
					<view class="ui-all" style="display: flex;flex-direction: column;gap: 10px;">
						<view class="ui-list" style="display: flex;align-items: center;gap: 10px;">
							<text>结算价格</text>
							<uni-easyinput v-model="curSku.setprice" type="number" trim="all"></uni-easyinput>
						</view>
						<view class="ui-list" style="display: flex;align-items: center;gap: 10px;">
							<text>指导价格</text>
							<uni-easyinput v-model="curSku.money" type="number" trim="all"></uni-easyinput>
						</view>
						<view class="ui-list" style="display: flex;align-items: center;gap: 10px;">
							<text>会员价格</text>
							<uni-easyinput v-model="curSku.price" type="number" trim="all"></uni-easyinput>
						</view>
						<view class="ui-list" style="display: flex;align-items: center;gap: 10px;">
							<text>当前库存</text>
							<uni-easyinput :disabled="Boolean(curSku.sku)" v-model="curSku.fund" type="number"
								trim="all"></uni-easyinput>
						</view>
					</view>
				</view>
				<view class="gl-popup-body" style="display: flex;gap: 10px;flex-direction: column;">
					<view v-show="false" style="display: flex;align-items: center;gap: 10px;">
						<checkbox-group @change="checkBoxChange">
							<label>
								<checkbox value="discount" :checked="curSku.discount === 1"
									style="transform:scale(0.7)" />
								禁用权益折扣
							</label>
						</checkbox-group>
						<uni-data-select v-model="curSku.need_level" :localdata="levelData"
							label="最低权益等级"></uni-data-select>
						<view class="" style="flex: 1;">
						</view>
					</view>
					<view style="font-size: small;color: #aaa;">注: 价格单位精确到分, 库存数量必须为整数。</view>
				</view>
				<view class="gl-popup-foot" style="display: flex;justify-content: flex-end;gap: 10px;">
					<view class="gl-button gl-button-base" @tap="popupEvent('save')">
						<uni-icons type="checkmarkempty" size="18" color="#fff"></uni-icons>
						<text style="font-size: small;">保存</text>
					</view>
					<view class="gl-button gl-button-warning" @tap="popupEvent">
						<uni-icons type="closeempty" size="18" color="#fff"></uni-icons>
						<text style="font-size: small;">取消</text>
					</view>
				</view>
				<!-- 产品封面上传 -->
				<cos-multiple-post ref="cosCover" :host="sConf.host" :token="sConf.auth.token" path="product" onHide
					once @upFinish="EventFinish"></cos-multiple-post>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import psMethod from '@/common/psMethod';
	export default {
		data() {
			return {
				title: 'SKU详情',
				sConf: getApp().globalData,
				curSku: null,
				levelData:[]
			}
		},
		props: {
			skuMdb: {
				type: Object,
				default: {
					icon: '/media/default/cover.png',
					name: null,
					idcode: null,
					sdcode: null,
					setprice: 0,
					money: 0,
					price: 0,
					fund: 0,
					discount: 0,
					sku: null,
					pid: null,
					gid: null,
				}
			},
			pid: {
				type: Number,
				default: null
			},
			gid: {
				type: Number,
				default: null
			},
		},
		methods: {
			async open(e = null) {
				if (e) {
					await this.loadDefData(e).then(res => {
						console.log('加载SKU属性', res);
						this.curSku = res.resmsg
					})
				} else {
					this.curSku = JSON.parse(JSON.stringify(this.skuMdb))
				}
				this.$refs.popup.open()
			},
			/**
			 * 传图结果
			 */
			EventFinish(e) {
				console.log('EventFinish', e);
				this.curSku.icon = e[0]
			},
			/**
			 * 传图组件
			 */
			changeCover() {
				this.$refs.cosCover.open()
			},
			popupEvent(e = 'close') {
				console.log('actionsClick', e);
				if (e === 'reload') {
					this.refresh()
				} else if (e === 'save') {
					if (Boolean(this.curSku.id)) {
						this.loadDataSkuPatch()
					} else {
						this.loadDataSkuPost()
					}
				} else if (e === 'new') {
					this.$refs.popup.open()
				} else {
					this.$refs.popup.close()
				}
			},
			loadDataSkuPatch() {
				let host = this.sConf.host + '/admin/cargoSku/' + this.curSku.id + '/';
				let token = this.sConf.auth.token || '';
				let data = this.curSku
				data['pid'] = this.pid
				data["gid"] = this.gid
				psMethod.authenticatorPatchSync(host, token, data).then(res => {
					if (res.rescode === 200) {
						let that = this
						uni.showToast({
							title: '提交成功',
							success() {
								that.$emit('refresh')
								that.popupEvent()
							}
						})
					}
				})
			},
			loadDataSkuPost() {
				let host = this.sConf.host + '/admin/cargoSku/';
				let token = this.sConf.auth.token || '';
				let data = this.curSku
				data['pid'] = this.pid
				data["gid"] = this.gid
				psMethod.authenticatorPostSync(host, token, data).then(res => {
					if (res.rescode === 200) {
						let that = this
						uni.showToast({
							title: '提交成功',
							success() {
								that.$emit('refresh')
								that.popupEvent()
							}
						})
					}
				})
			},
			loadDefData(e) {
				let host = this.sConf.host + '/admin/cargoSku/' + e + '/'
				let token = this.sConf.auth.token
				return new Promise((resolve, reject) => {
					psMethod.authenticatorGetSync(host, token).then(res => {
						resolve(res)
					}).catch(err => {
						reject(err)
					})
				})
			},
		}
	}
</script>

<style lang="scss" scoped>

</style>